<style>

        html, body {
            -ms-touch-action: none;
            background: #1d2054;
            padding: 0;
            border: 0;
            margin: 0;
            height: 100%;
            text-align: center;
        }

        .main_bg_pc{
            background-image: url(./imgs/bg.jpg);
            background-repeat: no-repeat;
            background-size: 100%;

        }

        .detail_top{
            background-image: url(./imgs/top_bg.png);
            background-repeat: no-repeat;
            background-size: 100%;
            width: 1200px;
            height: 184px;
            display: inline-block;
            position: relative;
        }

        .top_title{
            font-size: 28px;
            color: #fff;
            margin-top: 8px;
            position: absolute;
            left: 310px;
            top: 0;

        }

        .top_sign{
            position: absolute;
            font-size: 22px;
            color: #cde8ff;
            left: 280px;
            top: 75px;
        }

        .project_name{
            font-size: 24px;
            color: #fff;
            position: absolute;
            left: 65px;
            bottom: 26px;
        }

        .detail_content{
            background-image: url(./imgs/content_bg.png);
            background-repeat: no-repeat;
            background-size: 100%;
            width: 1199px;
            height: 1486px;
            display: inline-block;
        }

        .more_btn{
            display: inline-block;
            position: relative;
            width: 193px;
            height: 49px;
        }

        .more_btn img{
            width: 100%;
        }

        .content_container{
            display: inline-block;
            padding: 0;
            height: 1422px;
            overflow-y: auto;
        }

        .content_container li{
            background-image: url(./imgs/row_bg.png);
            background-repeat: no-repeat;
            background-size: 100%;
            width: 1172px;
            height: 161px;
            display: inline-block;
            position: relative;
            margin-top: 10px;
            line-height: 160px;
            text-align: left;
            font-size: 24px;
            color: #000;
        }

        .row_bg{
            position: absolute;
            width: 100%;
            left: 0;
            top: 0;
        }

        .avatar{
            position: absolute;
            left: 19px;
            top: 20px;
            width: 120px;
        }


        .user_name{
            position: relative;
            margin-left: 200px;

        }

        .row_content{
            position: relative;
            margin-left: 50px;

        }
        
        .reward_tag{
            position: absolute;
            top: 10px;
            right: 20px;
        }

        .row_time{
            position: absolute;
            font-size: 20px;
            bottom: 10px;
            right: 28px;
            line-height: 20px;
            color: #4b4b4b;
        }

        .hide{
            display: none !important;
        }
        
    </style>


<div class="detail_top">
    <span id="titleSpan" class="top_title">我是标题</span>
    <span id="signSpan" class="top_sign">签名</span>
    <span id="projectNameSpan" class="project_name">运营项目名字</span>
</div>
<div class="detail_content">

    <ul id="contentUl" class="content_container">
          <li>
            <img class="avatar" src="imgs/user_test.jpg">
            <img class="row_bg" src="imgs/row_fg.png">
            <span class="user_name">用户昵称</span>
            <span class="row_content">内容</span>
            <img class="reward_tag hide" src="imgs/reward_tag.png">
            <span class="row_time">2017年1月1日&nbsp;&nbsp;&nbsp;&nbsp;12:00:02</span>
        </li>
    </ul>
    
    <a id="moreBtn" class="more_btn"><img src="imgs/more_btn.png"></a>
</div>
</div>

<script id="liTpl" type="text/template">
        <li>
            <img class="avatar" src="imgs/user_test.jpg">
            <img class="row_bg" src="imgs/row_fg.png">
            <span class="user_name">用户昵称</span>
            <span class="row_content">内容</span>
            <img class="reward_tag hide" src="imgs/reward_tag.png">
            <span class="row_time">2017年1月1日&nbsp;&nbsp;&nbsp;&nbsp;12:00:02</span>
        </li>
    </script>